<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<script src="../../lib/jquery.min.js">
</script>
<script type="text/javascript">
    $(document).ready(function () {
        $(".ex .hide").click(function () {//监听这个按钮
            $(this).parents(".ex").hide("slow");//hide("slow")的意思是缓慢的隐藏
        })

    })

</script>
<style type="text/css">
    .ex{
        background-color: #e8f4fc;
        padding: 7px;
        border: 1px solid rosybrown;
    }
</style>
<body>
    <h3>中国办事处</h3>
    <div class="aa">
    <button class="sx" type="button">显示</button>
<div class="ex">
        <button class="hide" type="botton">隐藏</button>
        <p>联系人：张先生 <br>
            北三环中路 100号 <br>
            北京</p>
</div>

    <h3>美国办事处</h3>
    <div class="ex">
        <button class="hide" type="botton">隐藏</button>
        <p>联系人：cui <br>
            南山三环中路 100号 <br>
            南京</p>
    </div>
    </div>
</body>
</html>